<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>03_分区元素</title>
</head>
<body>
<!--1. 行内分区元素:不换行,用于选中一行中的一部分内容 -->
春天已经来到,你出门<span style="color: green;">踏青</span>了吗?
<br>
<!-- 要求: 小可爱-红  JSDTN2412-绿 第三阶段-蓝 -->
欢迎各位<span style="color:red;">小可爱</span>进入
<span style="color:green;">JSDTN2412</span>班级的
<span style="color:blue;">第三阶段</span>学习!
<br>
哈哈哈
<!-- 2.块级分区元素
默认高度为0,靠内容撑起来 默认宽度为父级宽度的100%  -->
<div style="width:500px;">
    <div style="width:300px;">222</div>
</div>
<div class="header">顶部条</div>
<div class="nav">导航栏</div>
<div class="aside">侧边栏</div>
<div class="main">主体内容</div>
<div class="footer">页尾</div>
<div class="section">部分</div>
<div class="article">文章</div>
<hr>
<!--h5新增了一些带有语义的标签-->
<header>头部</header>
<nav>导航</nav>
<aside>侧边</aside>
<main>主体</main>
<footer>页尾</footer>
<section>部分</section>
<article>文章</article>
</body>
</html>